<template>
<div style="height: 100%">
  <el-container style="min-height: 100vh;">

    <el-aside :width="sideWidth + 'px'" style="background-color: rgb(238, 241, 246); box-shadow: rgba(0,21,41,0.35) 2px 0px 6px">
<!--      <el-menu :default-openeds="opens" style="min-height: 100%; overflow-x: hidden;"
               background-color="#6AAB9C"
               text-color="#ECF5FF"
               active-text-color="#FFE4C7"
               :collapse-transition="false"
               :collapse="isCollapse"
               router
      >
        <div style="height: 60px; line-height: 60px; text-align: center">
          <b style="color: #ECF5FF;font-family: 华文行楷; font-size: 23px" v-show="logoTextShow">线上问诊后台系统</b>
        </div>
        <div v-for="item in menus" :key="item.id">
          <div v-if="item.path">
            <el-menu-item :index="item.path">
              <i :class="item.icon" style="color: #ECF5FF;"></i>
              <span slot="title">{{ item.name }}</span>
            </el-menu-item>
          </div>
          <div v-else>
            <el-submenu :index="item.id + ''">
              <template slot="title">
                <i :class="item.icon" style="color: #ECF5FF;"></i>
                <span slot="title">{{ item.name }}</span>
              </template>
              <div  v-for="subItem in item.children" :key="subItem.id">
                <el-menu-item :index="subItem.path">
                  <i :class="subItem.icon" style="color: #ECF5FF;"></i>
                  <span slot="title">{{ subItem.name }}</span>
                </el-menu-item>
              </div>
            </el-submenu>
          </div>
        </div>
      </el-menu>-->
      <Aside :is-collapse="isCollapse" :logoTextShow="logoTextShow" />
    </el-aside>

    <el-container>

      <el-header style="border-bottom: 1px solid #ccc; ">
        <Header :collapseBtnClass="collapseBtnClass" :collapse="collapse" :user="user" />
      </el-header>

      <el-main>
<!--        表示当前页面的子路由会在 router-view 里面展示-->
        <router-view @refreshUser="getUser" />
      </el-main>
    </el-container>
  </el-container>
</div>
</template>

<script>
import Aside from "../components/Aside";
import Header from "../components/Header";

export default {
  name: "Home",
  data(){
    return{
      msg: "hello lsy",
      collapseBtnClass: 'el-icon-s-fold',
      isCollapse: false,
      sideWidth: 220,
      logoTextShow: true,
      user: {},
      //menus: localStorage.getItem("admin") ? JSON.parse(localStorage.getItem("admin")).menus : [],
      //opens: localStorage.getItem("admin") ? JSON.parse(localStorage.getItem("admin")).menus.map(v => v.id + '') : []
    }
  },
  components: {
    Aside,
    Header,
  },
  created() {
    this.getUser()
    /*this.menus = JSON.parse(localStorage.getItem("admin")).menus
    console.log("数据")
    console.log(this.menus)*/
  },
  methods: {
    collapse(){ //点击收缩按钮触发
      this.isCollapse = !this.isCollapse
      if(this.isCollapse){ //收缩
        this.sideWidth = 65
        this.collapseBtnClass = 'el-icon-s-unfold'
        this.logoTextShow = false
      }else{ //展开
        this.sideWidth = 200
        this.collapseBtnClass = 'el-icon-s-fold'
        this.logoTextShow = true
      }
    },
    //获取用户的最新数据
    getUser(){
      let username = localStorage.getItem("adminInfo") ? JSON.parse(localStorage.getItem("adminInfo")).username : ""
      if (username) {
          this.request.post("/admin/findAdmin?username=" + username).then(res => {
            if (res) {
              console.log(res)
              this.user = res
            }
          })
      }
    }
  }
}
</script>



